<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>多个图表展示demo2</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no" />
		<link rel="stylesheet" href="public/neat.css" />
		<link rel="stylesheet" href="public/bootstrap.min.css" />
		<link rel="stylesheet" href="css/demo.css" />
	</head>
	<body class="body2">
		<div class="con">
			<div class="row-fluid" id="row3">
				<div class="span7" style="height:100%;">					
					<div class="row-fluid" style="height:100%;">
						<div class="span8 appointment" style="height:100%;">
							<h3 class="h3 lightblue mt0">2017 10月</h3>
							<div id="chart3" style="width:100%;height:calc( 100% - 45px);"></div>
							<table class="appoint-msg">
								<tr>
									<td style="color: #fdff3b;">预约人数</td>
									<td>1791</td>
									<td style="color: #fdff3b;">实挂人数</td>
									<td>424</td>
								</tr>
								<tr>
									<td style="color: #fdff3b;">爽约人数</td>
									<td>989</td>
									<td style="color: #fdff3b;">退约人数</td>
									<td>66</td>
								</tr>
							</table>
						</div>
						<div class="span4" style="height:100%;">
							<h4 class="h4 lightblue text-center">预约挂号科室前4名</h4>
							<div style="width:100%;height:calc(100% - 40px);">
								<div class="clearfix" style="width:100%;height:50%;">
									<div style="float:left;width:50%;height:100%;position:relative;">
										<div id="chart4" style="width:100%;height:100%;"></div>
										<p style="width: 100%;position: absolute;bottom: -10px;left:0;">
											<span>外科</span>
											<span style="float:right;margin-right: 10px;">486</span>
										</p>
									</div>
									<div style="float:left;width:50%;height:100%;position:relative;">
										<div id="chart5" style="width:100%;height:100%;"></div>
										<p style="width: 100%;position: absolute;bottom: -10px;left:0;">
											<span>内科</span>
											<span style="float:right;margin-right: 10px;">334</span>
										</p>
									</div>								
								</div>
								<div class="clearfix" style="width:100%;height:50%;">
									<div style="float:left;width:50%;height:100%;position:relative;">
										<div id="chart6" style="width:100%;height:100%;"></div>
										<p style="width: 100%;position: absolute;bottom: -10px;left:0;">
											<span>儿科</span>
											<span style="float:right;margin-right: 10px;">289</span>
										</p>
									</div>
									<div style="float:left;width:50%;height:100%;position:relative;">
										<div id="chart7" style="width:100%;height:100%;"></div>
										<p style="width: 100%;position: absolute;bottom: -10px;left:0;">
											<span>妇科</span>
											<span style="float:right;margin-right: 10px;">141</span>
										</p>
									</div>								
								</div>
							</div>							
						</div>
					</div>
				</div>				
				<div class="span5">
					<h4 class="h4 title text-center clearfix" id="mm">
						医疗总收入&nbsp;&nbsp;&nbsp;&nbsp;
						<span>344,130,136</span>
						<!--<p class="title-en">Total medical income</p>-->
					</h4>
					<div class="row-fluid box clearfix">
						<div class="left-fluid">
							<p class="mg" style="color: #fdff3b;">门急诊人次</p>
							<p class="mg">223,220</p>
							<p class="mg" style="color: #fdff3b;">均次费用</p>
							<p class="mg">179,92</p>
							<p class="mg" style="color: #fdff3b;">药占比</p>
							<p class="mg">42.01</p>
						</div>
						<div class="right-fluid">
							<div id="chart1" style="width:100%;"></div>
						</div>
					</div>
					<div class="row-fluid box clearfix">
						<div class="left-fluid">
							<p class="mg" style="color: #fdff3b;">出院人数</p>
							<p class="mg">20,154</p>
							<p class="mg" style="color: #fdff3b;">均次药费</p>
							<p class="mg">15,081.3</p>
							<p class="mg" style="color: #fdff3b;">药占比</p>
							<p class="mg">33.1</p>
						</div>
						<div class="right-fluid">
							<div id="chart2" style="width:100%;"></div>
						</div>
					</div>
				</div>
			</div>
			
			<div class="row-fluid" id="row4">
					<div class="span3 my-area" style="height:100%;">
						<h4 class="h4 lightblue" id="tableTitle1">各科室核心病种完成统计</h4>
						<table class="table t-head">
							<thead>
								<colgroup>
									<col width="14.28%" />
									<col width="14.28%" />
									<col width="14.28%" />
									<col width="14.28%" />
									<col width="14.28%" />
									<col width="14.28%" />
									<col width="14.28%" />
								</colgroup>
								<tr>
									<td>序号</td>
									<td>科室</td>
									<td>指标</td>
									<td>完成</td>
									<td>完成比</td>
									<td>年指标</td>
									<td>年完成比</td>
								</tr>
							</thead>
						</table>
						<div class="t-body" id="tBody1">
							<table class="table">
								<tbody>
									<colgroup>
										<col width="14.28%" />
										<col width="14.28%" />
										<col width="14.28%" />
										<col width="14.28%" />
										<col width="14.28%" />
										<col width="14.28%" />
										<col width="14.28%" />
									</colgroup>
									<tr class="sp-row">
										<td>0</td>
										<td>全院</td>
										<td>839</td>
										<td>930</td>
										<td>111%</td>
										<td>10,066</td>
										<td>9%</td>
									</tr>
									<tr>
										<td>1</td>
										<td>消化内科</td>
										<td>100</td>
										<td>167</td>
										<td>168%</td>
										<td>1,196</td>
										<td>14%</td>
									</tr>
									<tr>
										<td>2</td>
										<td>内分泌科</td>
										<td>84</td>
										<td>113</td>
										<td>134%</td>
										<td>1,012</td>
										<td>11%</td>
									</tr>
									<tr>
										<td>3</td>
										<td>心衰专科</td>
										<td>66</td>
										<td>81</td>
										<td>123%</td>
										<td>792</td>
										<td>10%</td>
									</tr>
									<tr>
										<td>4</td>
										<td>肾内科</td>
										<td>71</td>
										<td>87</td>
										<td>122%</td>
										<td>854</td>
										<td>10%</td>
									</tr>
									<tr>
										<td>1</td>
										<td>消化内科</td>
										<td>100</td>
										<td>167</td>
										<td>168%</td>
										<td>1,196</td>
										<td>14%</td>
									</tr>
									<tr>
										<td>2</td>
										<td>内分泌科</td>
										<td>84</td>
										<td>113</td>
										<td>134%</td>
										<td>1,012</td>
										<td>11%</td>
									</tr>
									<tr>
										<td>3</td>
										<td>心衰专科</td>
										<td>66</td>
										<td>81</td>
										<td>123%</td>
										<td>792</td>
										<td>10%</td>
									</tr>
									<tr>
										<td>4</td>
										<td>肾内科</td>
										<td>71</td>
										<td>87</td>
										<td>122%</td>
										<td>854</td>
										<td>10%</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="span4" style="height:100%;">
						<h4 class="h4 lightblue text-center" >各科室手术相关数据统计</h4>
						<div id="chart8" style="width:100%;height:calc(100% - 40px);"></div>
					</div>
					<div class="span2" style="height:100%;">
						<h4 class="h4 lightblue text-center" >住院死亡率</h4>
						<div id="chart9" style="width:100%;height:calc(100% - 40px);"></div>
					</div>					
					<div class="span3 my-area" style="height:100%;">
						<h4 class="h4 lightblue text-center" id="tableTitle2">医技科室情况</h4>
						<table class="table t-head">
							<thead>
								<colgroup>
									<col width="33.3%" />
									<col width="33.3%" />
									<col width="33.3%" />
								</colgroup>
								<tr>
									<td>医技科室</td>
									<td>工作量</td>
									<td>收入</td>
								</tr>
							</thead>
						</table>
						<div class="t-body" id="tBody2">
							<table class="table">
								<tbody>
									<colgroup>
										<col width="33.3%" />
										<col width="33.3%" />
										<col width="33.3%" />
									</colgroup>
									<tr>
										<td>检验科</td>
										<td>134,846</td>
										<td>11,847,030</td>
									</tr>
									<tr>
										<td>CT室</td>
										<td>7,058</td>
										<td>1,775,791</td>
									</tr>
									<tr>
										<td>普通放射科</td>
										<td>5,487</td>
										<td>431,720</td>
									</tr>
									<tr>
										<td>核磁共振室</td>
										<td>3,805</td>
										<td>1,565,260</td>
									</tr>
									<tr>
										<td>影像介入科</td>
										<td>10</td>
										<td>11,583</td>
									</tr>
									<tr>
										<td>检验科</td>
										<td>134,846</td>
										<td>11,847,030</td>
									</tr>
									<tr>
										<td>CT室</td>
										<td>7,058</td>
										<td>1,775,791</td>
									</tr>
									<tr>
										<td>普通放射科</td>
										<td>5,487</td>
										<td>431,720</td>
									</tr>
									<tr>
										<td>核磁共振室</td>
										<td>3,805</td>
										<td>1,565,260</td>
									</tr>
									<tr>
										<td>影像介入科</td>
										<td>10</td>
										<td>11,583</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>				
		</div>
		
		
		<script src="public/jquery.js"></script>
		<script src="public/echarts.min.js"></script>
		<script src="js/demo2.js"></script>
	</body>
</html>
